<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <script src="/res/js/jquery-3.4.1.min.js"></script>
    <script src="/res/js/tools.js"></script>
    <style>
        body{
            background-image: url("/res/img/en.jpg");
            background-size: 100%;
        }
        .open{
            width: 420px;
            height: 520px;
            margin: 120px auto;
        }
        .open table tr{
            height: 40px;
        }
        input{
            opacity: 0.7;
            border: 0px;
        }
        .so{
            width: 200px;
            height: 30px;
        }
        #soul{
            width: 200px;
            height: 40px;
            border-radius: 20px;
            background: #808080;
            color: black;
            margin: 0px auto;
        }
    </style>
    <script>
        $(function (){
                $("#soul").on("click",function (){
                    //不可用于上传文件
                    let url="/vipTb/add";
                    let data=$("#registFrom").serialize();
                    console.info(data);
                    $.post(url,data,function (resp){
                        if (resp.state=="1"){
                           location.href="/pages/Login.html";
                        }
                    },"json")
                });
            $("#uName").on("blur",function (){
                let url="/vipTb/checkName";
                let data={vname:$(this).val()}
                $.post(url,data,function (resp){
                    if (resp.state=="0"){

                        $("#userNameMsg").html("用户名已存在！");
                        $("#userNameMsg").css("color","red");
                        $("#uName").val("");//不能注册
                    }else{
                        $("#userNameMsg").css("color","green");
                        $("#userNameMsg").html("可以注册");
                    }
                },"json")
            })
        })
    </script>
</head>
<body>
<fieldset class="open">
    <legend>注册信息</legend>
    <form action="" method="post" id="registFrom" >
        <table>
            <tr>
                <td>用户名：</td><td><input type="text" id="uName" name="vname" class="so" placeholder="请输入用户名" required /></td>
                <td id="userNameMsg"></td>
            </tr>
            <tr>
                <td>密码：</td><td><input type="password" name="vpwd" class="so" placeholder="请输入至少6位密码" required /></td>
                <td></td>
            </tr>
            <tr>
                <td>密码：</td><td><input type="date" name="vbirthday" class="so"  /></td>
                <td></td>
            </tr>

            <tr>
                <td colspan="2">
                    <input type="button" value="注册" id="soul">
                </td>
                <td>
                    <a href="/pages/Login.html" >登录</a>
                </td>
            </tr>
        </table>
    </form>
</fieldset>
</body>
</html>